<!DOCTYPE html>
<html>
<head>
    <title>Bootstrap 实例</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
    <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>

<div class="container">
    <form action="{:url('./login')}" method="post">
        <div class="form-group">
            <label>请输入手机号:</label>
            <input type="text" class="form-control" id="phone" name="phone">
        </div>
        <div class="form-group">
            <label for="pwd">请输入验证码:</label>
            <input type="text" class="form-control" id="pwd" name="captcha">
<!--            <a href="{:url('./captcha')}">获取验证码</a>-->
            <a href="#" id="captcha">获取验证码</a>
        </div>
        <button type="submit" class="btn btn-primary">登录</button>
    </form>
</div>
<script>
    $('#captcha').click(function (){
        var phone = $('#phone').val();
        console.log(phone);
        $.ajax({
            url:"captcha",
            data:{phone:phone},
            success:function (e){
                console.log(e)
            }
        })
    });
</script>
</body>
</html>